@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600');
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap');

body {
	font-family: Roboto Mono;
	color: #FFF;
  background-color: #141414;
}

.button {
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline: none;
}
button:focus {
  border: none;
  outline: none;
}

html {
  scroll-behavior: smooth;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
}

* {
margin: 0;
padding: 0;
}

*::-webkit-scrollbar {
  display: none;
}
* {
	overflow-x: hidden;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.overlay {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background-image: url(../imgs/noisegif.gif);
	position: fixed;
	opacity: .05;

}

/* header starts here */

.header{
  width: 100%;
  margin-top: 15px;
}

.header a{
  text-align: center;
  cursor: pointer;
  position: relative;
  text-decoration:none;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-transform: uppercase;
  z-index: 2;
}

.nav-link {
  text-align: center;
}

.spanLeft{
  position: relative;
  left:-7px;
  opacity:0;
  transition:0.25s;
}

.spanRight{
  position: relative;
  right:-7px;
  opacity:0;
  transition:0.25s;
}

.header a:hover .spanLeft{
  position: relative;
  left:-20px;
  opacity:1;
  color: #ff007f;
}

.header a:hover .spanRight{
  position: relative;
  right:-20px;
  opacity:1;
  color: #ff007f;
}


/* slides starts here */

.control {
	display: inline-flex;
	justify-content: space-around;
	align-items: center;
}

.control-btn {
	height: calc(100vh - 70px);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	color: #ff007f;
	margin: 10px;
	z-index: -1;
}

.vid:focus {
		outline: none;
}

.slides {
	margin-top: 15px;
	max-height: 90vh;
	max-width: 90vw;
	z-index: 1;
}

.imgs {
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.btn-left {
  position: absolute;
  left: 0;
  color: transparent;
  background-color: transparent;
  height: 100%;
  width: 50%;
  border: none;
}
.btn-right {
  position: absolute;
  right: 0;
  color: transparent;
  background-color: transparent;
  height: 100%;
  width: 50%;
  border: none;
}

#auto {
	pointer-events: none;
	z-index: 0;
}

/* #footer starts here */


#page-container {
  position: relative;
  min-height: 100vh;
}

#content-wrap {
  padding-bottom: 70px;    /* Footer height */
}

.footer {
  position: relative;
  bottom: 0;
  width: 100%;
  height: 70px;            /* Footer height */
	text-align: center;
}


.footer-box {
  background-color: #000;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}